<!-- 学管统计 -->
<template>
  <div class="lms">
    <el-form label-width="80px" :inline="true">
      <el-form-item label="选择时间">
        <el-date-picker
          v-model="timeArr"
          :clearable="false"
          type="datetimerange"
          :picker-options="pickerOptions"
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
          align="right"
        ></el-date-picker>
      </el-form-item>
      <el-form-item label="所属年级">
        <el-select v-model="param.grade" placeholder="请选择所属年级">
          <el-option label="全部" :value="null"></el-option>
          <el-option
            v-for="(item, index) in selectArr"
            :key="index"
            :label="item.display_value"
            :value="item.t_id"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="辅导老师">
        <el-input
          v-model="param.teacher_name"
          placeholder="请输入辅导老师的姓名"
          clearable
        ></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" size="small" @click="totalStatisticsFn()"
          >搜索</el-button
        >
      </el-form-item>
      <el-button
        type="primary"
        style="float: right;"
        size="small"
        @click="tutorStudyStatisticsFn"
        >导出</el-button
      >
    </el-form>

    <!-- 头部的内容 -->
    <el-card class="box-card lms_t">
      <div class="cenFlex">
        <div v-for="(lms, index) in lmsDataList" :key="index" class="lms_t_in">
          <div
            class="cenFlex lms_t_in_num"
            ref="numberGrow"
            :data-time="3000"
            :data-value="Number(lms.num)"
          >
            {{ lms.num }}{{ lms.nuit || "" }}
          </div>
          <div class="cenFlex lms_t_in_title">
            <el-tooltip
              class="item"
              effect="dark"
              :disabled="lms.hoverTitle ? false : true"
              :content="lms.hoverTitle"
              placement="right"
            >
              <div>{{ lms.title }}</div>
            </el-tooltip>
          </div>
        </div>
      </div>
    </el-card>
    <!-- 列表的内容 -->
    <el-card
      class="box-card lms_list_box"
      v-for="(item, index) in lms_list"
      :key="index"
    >
      <div slot="header" class="clearfix">
        <el-row>
          <el-col :span="5">
            <div class="lms_list lms_list_l_1">
              <div class="lms_list_l_t">{{ item.school_name || "--" }}</div>
              <div class="lms_list_l_b">{{ item.address || "--" }}</div>
            </div>
          </el-col>
          <el-col :span="3">
            <div class="lms_list lms_list_l_2">
              学管：{{ returnXgData(item.teacher_names) }}
            </div>
          </el-col>
          <el-col :span="3">
            <div class="lms_list lms_list_l_2" style="padding-left:50px">
              市场：{{ item.market_user_name || "--" }}
            </div>
          </el-col>
          <el-col :span="3">
            <div class="lms_list lms_list_l_3">
              <div class="lms_list_l_t cenFlex">
                {{ item.sign_up_num || 0 }}/{{ item.total_sign_up_num || 0 }}
              </div>
              <div class="lms_list_l_b cenFlex f999">
                <el-tooltip
                  class="item"
                  effect="dark"
                  content="辅导老师所带的该校报名学生人数/该校该年级累计报名学生人数"
                  placement="right"
                >
                  <div>报名人数/总报名人数</div>
                </el-tooltip>
              </div>
            </div>
          </el-col>
          <el-col :span="3">
            <div class="lms_list lms_list_l_3">
              <div class="lms_list_l_t cenFlex">
                {{ item.attendance_class_num || 0 }}
              </div>
              <div class="lms_list_l_b cenFlex f999">
                <el-tooltip
                  class="item"
                  effect="dark"
                  content="所有课程有1讲及以上签到的学生总数"
                  placement="right"
                >
                  <div>到课学生</div>
                </el-tooltip>
              </div>
            </div>
          </el-col>
          <el-col :span="3">
            <div class="lms_list lms_list_l_3">
              <div class="lms_list_l_t cenFlex">
                {{
                  item.attendance_rate
                    ? (item.attendance_rate * 100).toFixed(2)
                    : 0
                }}%
              </div>
              <div class="lms_list_l_b cenFlex f999">
                <el-tooltip
                  class="item"
                  effect="dark"
                  content="到课的学生人数/报名的学生人数"
                  placement="right"
                >
                  <div>到课率</div>
                </el-tooltip>
              </div>
            </div>
          </el-col>
          <el-col :span="3">
            <div class="lms_list lms_list_l_3">
              <div class="lms_list_l_t cenFlex">{{ item.return_num || 0 }}</div>
              <div class="lms_list_l_b cenFlex f999">
                <el-tooltip
                  class="item"
                  effect="dark"
                  content="在辅导老师APP对应学生详情页中添加回访记录的次数"
                  placement="right"
                >
                  <div>回访次数</div>
                </el-tooltip>
              </div>
            </div>
          </el-col>
          <el-col :span="1">
            <el-button
              style="float: right; padding: 3px 0;margin-top:20px"
              type="text"
              @click.native="showCard(false, item, index)"
              >{{ item.show ? "收起" : "展开" }}</el-button
            >
          </el-col>
        </el-row>
      </div>
      <el-collapse-transition v-if="item.list">
        <div v-show="item.show" class="lms_list_warp_h">
          <div v-for="(o, ix) in item.list" :key="ix" class>
            <div class="lms_list_warp">
              <el-row>
                <el-col :span="5">
                  <div
                    class="lms_list lms_list_l_1"
                    style="display:flex;align-items: center;"
                  >
                    <div class="fw600">
                      {{ o.course_name || "--" }} {{ o.period_sort }}期
                    </div>
                  </div>
                </el-col>
                <el-col :span="3">
                  <div
                    class="lms_list lms_list_l_2"
                    style="display:flex;align-items: center;"
                  >
                    学管：{{ returnXgData(o.teacher_names) }}
                  </div>
                </el-col>
                <el-col :span="3">
                  <div style="opacity: 0;">1</div>
                </el-col>
                <el-col :span="3">
                  <div class="lms_list lms_list_l_3">
                    <div class="cenFlex fw600 f20">
                      {{ o.sign_up_num || 0 }}
                    </div>
                    <div class="lms_list_l_b cenFlex thead_f">报名人数</div>
                  </div>
                </el-col>
                <el-col :span="3">
                  <div class="lms_list lms_list_l_3">
                    <div class="cenFlex fw600 f20">
                      {{ o.join_course_num || 0 }}
                    </div>
                    <div class="lms_list_l_b cenFlex thead_f">
                      <el-tooltip
                        class="item"
                        effect="dark"
                        content="课程完课1讲以上的人数"
                        placement="right"
                      >
                        <div>参课人数</div>
                      </el-tooltip>
                    </div>
                  </div>
                </el-col>
                <el-col :span="2">
                  <div class="lms_list lms_list_l_3">
                    <div class="cenFlex fw600 f20">
                      {{
                        o.join_course_rate
                          ? (o.join_course_rate * 100).toFixed(2)
                          : 0
                      }}%
                    </div>
                    <div class="lms_list_l_b cenFlex thead_f">
                      <el-tooltip
                        class="item"
                        effect="dark"
                        content="参课人数/报名人数"
                        placement="right"
                      >
                        <div>参课率</div>
                      </el-tooltip>
                    </div>
                  </div>
                </el-col>
                <el-col :span="2">
                  <div class="lms_list lms_list_l_3">
                    <div class="cenFlex fw600 f20">
                      {{
                        o.avg_attendance_rate
                          ? (o.avg_attendance_rate * 100).toFixed(2)
                          : 0 || 0
                      }}%
                    </div>
                    <div class="lms_list_l_b cenFlex thead_f">
                      <el-tooltip
                        class="item"
                        effect="dark"
                        content="课程出勤的总人次/课程应出勤的总人次"
                        placement="right"
                      >
                        <div>平均出勤率</div>
                      </el-tooltip>
                    </div>
                  </div>
                </el-col>
                <el-col :span="2">
                  <div class="lms_list lms_list_l_3">
                    <div class="cenFlex fw600 f20">
                      {{
                        o.finish_course_rate
                          ? (o.finish_course_rate * 100).toFixed(2)
                          : 0 || 0
                      }}%
                    </div>
                    <div class="lms_list_l_b cenFlex thead_f">
                      <el-tooltip
                        class="item"
                        effect="dark"
                        content="课程下所有讲次都完课的人数/课程的参课人数"
                        placement="right"
                      >
                        <div>课程完课率</div>
                      </el-tooltip>
                    </div>
                  </div>
                </el-col>
                <el-col :span="1">
                  <el-button
                    style="float: right; padding: 3px 0;margin-top:20px"
                    type="text"
                    @click.native="
                      o.school_id = item.school_id;
                      showCard(false, o, index, ix);
                    "
                    >{{ o.show ? "收起" : "展开" }}</el-button
                  >
                </el-col>
              </el-row>
            </div>

            <el-collapse-transition v-if="o.sub_list">
              <div v-show="o.show">
                <el-table
                  :data="o.sub_list"
                  style="width: 100%"
                  header-cell-class-name="thead_f"
                >
                  <el-table-column label="讲次" width="300">
                    <template slot-scope="scope">
                      <b class="f16px"
                        >第{{ scope.row.lesson_sort }}讲：{{
                          scope.row.lesson_name
                        }}</b
                      >
                    </template>
                  </el-table-column>
                  <el-table-column label="应出勤" show-overflow-tooltip>
                    <template slot="header" slot-scope="scope">
                      <el-tooltip
                        class="item"
                        effect="dark"
                        content="有本讲次任务的学生数"
                        placement="bottom"
                      >
                        <div>应出勤</div>
                      </el-tooltip>
                    </template>
                    <template slot-scope="scope">
                      <b>{{ scope.row.total_num || 0 }}</b>
                    </template>
                  </el-table-column>
                  <el-table-column label="出勤">
                    <template slot="header" slot-scope="scope">
                      <el-tooltip
                        class="item"
                        effect="dark"
                        content="讲次签到的人数"
                        placement="bottom"
                      >
                        <div>出勤</div>
                      </el-tooltip>
                    </template>
                    <template slot-scope="scope">
                      <b>{{ scope.row.attendance || 0 }}</b>
                    </template>
                  </el-table-column>
                  <el-table-column label="出勤率">
                    <template slot="header" slot-scope="scope">
                      <el-tooltip
                        class="item"
                        effect="dark"
                        content="出勤人数/应出勤人数"
                        placement="bottom"
                      >
                        <div>出勤率</div>
                      </el-tooltip>
                    </template>
                    <template slot-scope="scope">
                      <b
                        >{{
                          scope.row.attendance_rate
                            ? (scope.row.attendance_rate * 100).toFixed(2)
                            : 0
                        }}%</b
                      >
                    </template>
                  </el-table-column>
                  <el-table-column label="平均听课时长">
                    <template slot="header" slot-scope="scope">
                      <el-tooltip
                        class="item"
                        effect="dark"
                        content="所有学生听课总时长/签到学生人数"
                        placement="bottom"
                      >
                        <div>平均听课时长</div>
                      </el-tooltip>
                    </template>
                    <template slot-scope="scope">
                      <b>{{ sToHS(scope.row.avg_watch_time || 0) }}</b>
                    </template>
                  </el-table-column>
                  <el-table-column label="完课">
                    <template slot="header" slot-scope="scope">
                      <el-tooltip
                        class="item"
                        effect="dark"
                        content="听课时长占讲次总时长80%以上.注：讲次开始时间按系统设置时间，结束时间按手动点击结束直播时间"
                        placement="bottom"
                      >
                        <div>完课</div>
                      </el-tooltip>
                    </template>
                    <template slot-scope="scope">
                      <b>{{ scope.row.finish_class_num || 0 }}</b>
                    </template>
                  </el-table-column>
                  <el-table-column label="完课率">
                    <template slot="header" slot-scope="scope">
                      <el-tooltip
                        class="item"
                        effect="dark"
                        content="完课的学生数/签到的学生数"
                        placement="bottom"
                      >
                        <div>完课率</div>
                      </el-tooltip>
                    </template>
                    <template slot-scope="scope">
                      <b
                        >{{
                          scope.row.finish_class_rate
                            ? (scope.row.finish_class_rate * 100).toFixed(2)
                            : 0
                        }}%</b
                      >
                    </template>
                  </el-table-column>
                  <el-table-column label="课堂答题率">
                    <template slot="header" slot-scope="scope">
                      <el-tooltip
                        class="item"
                        effect="dark"
                        content="课堂答题的次数/出勤学生应答题的次数(收到题的算作应答题)"
                        placement="bottom"
                      >
                        <div>课堂答题率</div>
                      </el-tooltip>
                    </template>
                    <template slot-scope="scope">
                      <b
                        >{{
                          scope.row.classroom_test_rate
                            ? (scope.row.classroom_test_rate * 100).toFixed(2)
                            : 0
                        }}%</b
                      >
                    </template>
                  </el-table-column>
                  <el-table-column label="课堂答题参与率">
                    <template slot="header" slot-scope="scope">
                      <el-tooltip
                        class="item"
                        effect="dark"
                        content="课堂答题的学生数/签到的学生数"
                        placement="bottom"
                      >
                        <div>课堂答题参与率</div>
                      </el-tooltip>
                    </template>
                    <template slot-scope="scope">
                      <b
                        >{{
                          scope.row.classroom_test_join_rate
                            ? (
                                scope.row.classroom_test_join_rate * 100
                              ).toFixed(2)
                            : 0
                        }}%</b
                      >
                    </template>
                  </el-table-column>
                  <el-table-column label="课堂正答率">
                    <template slot="header" slot-scope="scope">
                      <el-tooltip
                        class="item"
                        effect="dark"
                        content="本讲答题正确的次数/本讲所有答题的次数"
                        placement="bottom"
                      >
                        <div>课堂正答率</div>
                      </el-tooltip>
                    </template>
                    <template slot-scope="scope">
                      <b
                        >{{
                          scope.row.in_classroom_right_rate
                            ? (scope.row.in_classroom_right_rate * 100).toFixed(
                                2
                              )
                            : 0
                        }}%</b
                      >
                    </template>
                  </el-table-column>
                  <el-table-column label="互动参与率">
                    <template slot="header" slot-scope="scope">
                      <el-tooltip
                        class="item"
                        effect="dark"
                        content="参与互动的次数/应参与互动的人次数。(互动包含系统互动和提问)"
                        placement="bottom"
                      >
                        <div>互动参与率</div>
                      </el-tooltip>
                    </template>
                    <template slot-scope="scope">
                      <b
                        >{{
                          scope.row.interact_rate
                            ? (scope.row.interact_rate * 100).toFixed(2)
                            : 0
                        }}%</b
                      >
                    </template>
                  </el-table-column>
                  <el-table-column label="作业提交率">
                    <template slot="header" slot-scope="scope">
                      <el-tooltip
                        class="item"
                        effect="dark"
                        content="(预习作业+课后作业提交的总次数）/（（签到人数+只看回放未签到的人数）的应提交预习+课后作业数)"
                        placement="bottom"
                      >
                        <div>作业提交率</div>
                      </el-tooltip>
                    </template>
                    <template slot-scope="scope">
                      <b
                        >{{
                          scope.row.commit_rate
                            ? (scope.row.commit_rate * 100).toFixed(2)
                            : 0
                        }}%</b
                      >
                    </template>
                  </el-table-column>
                  <el-table-column label="作业批改率">
                    <template slot-scope="scope">
                      <b
                        >{{
                          scope.row.correct_rate
                            ? (scope.row.correct_rate * 100).toFixed(2)
                            : 0
                        }}%</b
                      >
                    </template>
                  </el-table-column>
                  <el-table-column label="作业正答率">
                    <template slot="header" slot-scope="scope">
                      <el-tooltip
                        class="item"
                        effect="dark"
                        content="预习作业+课后作业答题正确的题数)/(预习作业+课后作业答题的次数"
                        placement="bottom"
                      >
                        <div>作业正答率</div>
                      </el-tooltip>
                    </template>
                    <template slot-scope="scope">
                      <b
                        >{{
                          scope.row.after_classroom_right_rate
                            ? (
                                scope.row.after_classroom_right_rate * 100
                              ).toFixed(2)
                            : 0
                        }}%</b
                      >
                    </template>
                  </el-table-column>
                </el-table>
              </div>
            </el-collapse-transition>
          </div>
          <el-pagination
            background
            @size-change="
              val => {
                sizeChangeSonHandle(val, item, index);
              }
            "
            @current-change="
              val => {
                currentChangeSonHandle(val, item, index);
              }
            "
            :current-page="item.pageIndex"
            :page-sizes="[5, 10, 20, 50, 100]"
            :page-size="item.pageSize"
            :total="item.totalPage"
            layout="total, sizes, prev, pager, next, jumper"
          ></el-pagination>
        </div>
      </el-collapse-transition>
    </el-card>
    <el-pagination
      @size-change="sizeChangeHandle"
      @current-change="currentChangeHandle"
      :current-page="pageIndex"
      :page-sizes="[5, 10, 20, 50, 100]"
      :page-size="pageSize"
      :total="totalPage"
      layout="total, sizes, prev, pager, next, jumper"
    ></el-pagination>
  </div>
</template>

<script>
import { queyEnumByTableName } from "@/api/api.js";
import {
  totalStatistics,
  schoolStatistics,
  courseStatistics,
  lessonStatistics,
  tutorStudyStatistics
} from "@/api/operate.js";
import utils from "@/utils/common.js";
export default {
  data() {
    return {
      pageIndex: 1,
      pageSize: 10,
      childPageIndex: 1,
      childPageSize: 10,
      totalPage: 0,
      pickerOptions: {
        shortcuts: [
          {
            text: "最近一周",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "最近一个月",
            onClick: picker => {
              picker.$emit("pick", [
                utils.getDate(utils.getLast3Month(1).last),
                utils.getDate(utils.getLast3Month(1).now)
              ]);
            }
          },
          {
            text: "最近三个月",
            onClick: picker => {
              picker.$emit("pick", [
                utils.getDate(utils.getLast3Month().last),
                utils.getDate(utils.getLast3Month().now)
              ]);
            }
          },
          {
            text: "最近半年",
            onClick: picker => {
              picker.$emit("pick", [
                utils.getDate(utils.getLast3Month(6).last),
                utils.getDate(utils.getLast3Month(6).now)
              ]);
            }
          }
        ]
      },
      timeArr: [],
      param: {
        start_time: "",
        end_time: "",
        teacher_name: "",
        grade: null
      },
      selectArr: [],
      lms_list: [],
      lmsDataList: []
    };
  },
  watch: {
    timeArr(val) {
      if (val) {
        this.param = {
          ...this.param,
          ...{
            start_time: val[0] ? utils.timeChange(val[0]) : "",
            end_time: val[1] ? utils.timeChange(val[1]) : ""
          }
        };
      } else {
        this.param = {
          ...this.param,
          ...{
            start_time: "",
            end_time: ""
          }
        };
      }
    }
  },
  created() {
    this.getSelectData();
    this.totalStatisticsFn();
  },
  mounted() {
    this.timeArr = [
      utils.getDate(utils.getLast3Month().last),
      utils.getDate(utils.getLast3Month().now)
    ];
  },
  methods: {
    sToHS(s) {
      return utils.sToHS(s);
    },
    // 点击导出Excel
    tutorStudyStatisticsFn() {
      let { param } = this;
      tutorStudyStatistics(param).then(res => {
        if (res && res[1]) {
          utils.downExcel(
            res,
            `学管统计表${param.teacher_name ? "-" + param.teacher_name : ""}${
              param.start_time
                ? "-" + param.start_time + "-" + param.end_time
                : ""
            }`
          );
          this.totalStatisticsFn();
        }
      });
    },

    // 初始获取总列表
    totalStatisticsFn() {
      let { param } = this;
      totalStatistics(param).then(res => {
        if (res && res[1].code == 0) {
          let statisticsList = res[1].data.statisticsList[0];
          this.lmsDataList = [
            {
              num: statisticsList.school_num || 0,
              title: "学校数",
              hoverTitle: "辅导老师所带学生来源需学校的总数量"
            },
            {
              num: statisticsList.total_sign_up_num || 0,
              title: "报名人数",
              hoverTitle: "辅导老师所带的该校报名学生人数"
            },
            {
              num: statisticsList.attendance_class_num || 0,
              title: "到课学生数",
              hoverTitle: "所有课程有1讲及以上签到的学生总数"
            },
            {
              num: (Number(statisticsList.avg_attendance_rate) * 100).toFixed(
                2
              ),
              title: "平均出勤率",
              nuit: "%",
              hoverTitle:
                "所有课程所有讲次的出勤总人次/所有课程所有讲次应出勤的总人次"
            },
            {
              num: statisticsList.return_num || 0,
              title: "回访次数",
              hoverTitle: "在辅导老师APP对应学生详情页中添加回访记录的次数"
            }
          ];
          this.lmsDataList.splice(0, 1, this.lmsDataList[0]);
          this.$nextTick(() => {
            // this.numberGrow(this.$refs.numberGrow);
          });

          this.pageIndex = 1;
          this.getSchoolList();
        }
      });
    },
    // 获取学校的列表
    getSchoolList() {
      let { param } = this;
      param = {
        ...param,
        ...{
          currPage: this.pageIndex,
          pageSize: this.pageSize
        }
      };
      schoolStatistics(param).then(res => {
        if (res && res[1].code == 0) {
          this.lms_list = res[1].data.statisticsList;
          this.totalPage = res[1].data.totalCount;
        }
      });
    },

    // 获取下拉菜单数据
    async getSelectData() {
      let res = await queyEnumByTableName({ tableName: "nice_course" });
      if (res[0]) {
        return;
      }
      let arr = res[1].data;
      res[1].data.forEach(item => {
        if (item.fieldName == "grade") {
          this.selectArr = item.child;
        }
      });
    },
    // 血管数据处理
    returnXgData(str) {
      let newStr = "";
      if (str) {
        let newArr = [];
        let arr = str.split(",");
        for (let i = 0; i < 3; i++) {
          arr[i] && newArr.push(arr[i]);
        }
        newStr = newArr.join(",");
      }

      return newStr;
    },
    // 点击展开
    showCard(show, item, index, ix) {
      let { lms_list, param } = this;
      if (!show) {
        this.childPageIndex = 1;
      }
      if (ix >= 0) {
        // 课时的统计
        param = {
          ...param,
          ...{
            course_period_id: item.course_period_id,
            currPage: 1,
            pageSize: 100,
            school_id: item.school_id
          }
        };

        // lms_list[index].list[ix].pageSize = this.childPageSize;
        if (lms_list[index].list[ix].show && !show) {
          lms_list[index].list[ix].show = false;
          this.lms_list.splice(index, 1, lms_list[index]);
          return;
        }
        lessonStatistics(param).then(res => {
          if (res && res[1].code == 0) {
            if (res[1].data.statisticsList[0]) {
              lms_list[index].list[ix].sub_list = res[1].data.statisticsList;
              // lms_list[index].list[ix].totalPage = res[1].data.totalCount;
              // lms_list[index].list[ix].pageSize = 1;
            } else {
              this.$message("暂无课时");
            }
            this.$nextTick(() => {
              lms_list[index].list[ix].show = true;
              this.lms_list.splice(index, 1, lms_list[index]);
            });
          }
        });
      } else {
        // 课程的统计
        param = {
          ...param,
          ...{
            school_id: item.school_id,
            currPage: this.childPageIndex,
            pageSize: this.childPageSize
          }
        };

        lms_list[index].pageSize = this.childPageSize;
        lms_list[index].pageIndex = this.childPageIndex;
        if (lms_list[index].show && !show) {
          lms_list[index].show = false;
          this.lms_list.splice(index, 1, lms_list[index]);
          return;
        }
        courseStatistics(param).then(res => {
          if (res && res[1].code == 0) {
            if (res[1].data.statisticsList[0]) {
              lms_list[index].list = res[1].data.statisticsList;
              lms_list[index].totalPage = res[1].data.totalCount;
              // lms_list[index].pageSize = 1;
            } else {
              this.$message("暂无课程");
            }
            this.$nextTick(() => {
              lms_list[index].show = true;
              this.lms_list.splice(index, 1, lms_list[index]);
            });
          }
        });
      }
    },
    numberGrow(ele) {
      this.lmsDataList.forEach((eachVal, index) => {
        let _this = this;
        let step = parseInt((Number(eachVal.num) * 15) / 600);
        let current = 0;
        let start = 0;
        let t = setInterval(function() {
          start += step;
          if (start > Number(eachVal.num)) {
            clearInterval(t);
            start = Number(eachVal.num);
            t = null;
          }
          if (current === start) {
            return;
          }
          current = start;
          ele[index].innerHTML = `${current}${eachVal.nuit || ""}`
            .toString()
            .replace(/(\d)(?=(?:\d{3}[+]?)+$)/g, "$1,");
        }, 10);
      });
    },
    // 每页数
    sizeChangeHandle(val) {
      this.pageSize = val;
      this.pageIndex = 1;
      this.getSchoolList();
    },
    // 当前页
    currentChangeHandle(val) {
      this.pageIndex = val;
      this.getSchoolList();
    },
    // 每页数
    sizeChangeSonHandle(val, item, index, ix) {
      this.childPageSize = val;
      this.childPageIndex = 1;
      console.log(this.childPageIndex);
      this.showCard(true, item, index, ix);
    },
    // 当前页
    currentChangeSonHandle(val, item, index, ix) {
      this.childPageIndex = val;
      this.showCard(true, item, index, ix);
    }
  }
};
</script>
<style scoped lang="scss">
b {
  font-size: 20px;
}
.f16px {
  font-size: 16px;
}
.f20 {
  font-size: 20px;
}
.cenFlex {
  display: flex;
  align-items: center;
  justify-content: center;
}
.fw600 {
  font-weight: 600;
}
.f999 {
  color: #999;
}
.lms_t_in {
  width: 300px;
  margin-right: 20px;
  padding: 20px 0px;
  &:nth-last-child(1) {
    margin-right: 0px;
  }
  .lms_t_in_num {
    font-size: 40px;
    margin-bottom: 10px;
  }
  .lms_t_in_title {
    color: #999;
  }
}
.lms_list_box {
  margin-top: 20px;
}
.lms_list {
  min-height: 60px;
}
.lms_list_warp_h {
  transition: linear 0.3s;
}
.lms_list_warp {
  padding-bottom: 20px;
  border-bottom: 1px #ebeef5 solid;
  padding-top: 20px;
  // &:nth-last-child(1) {
  //   border-bottom: 0px #ebeef5 solid;
  // }
}
.lms {
  ::v-deep.el-card__body {
    padding: 0px 20px;
  }
  ::v-deep.el-pagination {
    margin-bottom: 15px;
  }
}

.lms_list_l_1 {
  .lms_list_l_t {
    font-size: 26px;
    font-weight: 600;
    margin-bottom: 10px;
  }
  .lms_list_l_b {
    color: #999;
  }
}
.lms_list_l_3 {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: center;
  .lms_list_l_t {
    font-size: 20px;
    width: 100%;
    font-weight: 600;
    // margin-bottom: 5px;
  }
  .lms_list_l_b {
    width: 100%;
  }
}
</style>
